<template>
	<!-- 资料集中营首页 -->
	<view class="body">
		<myHeader :title="title"></myHeader>
		<view class="mt-20 p-20">
			<uni-forms :value="formData" ref="form" :rules="rules">
				<uni-forms-item label="学习主题" name="name">
					<uni-easyinput type="text" v-model="formData.name" placeholder="请输入学习主题" />
				</uni-forms-item>
				<uni-forms-item class="p-5" required name="header" label="任务指派">
					<picker @change="bindPickerChange($event,candidates)" :range="candidates" :range-key="'realName'">
						<view class="uni-input">{{candidates[idx].realName}}</view>
					</picker>
				</uni-forms-item>
			</uni-forms>
		</view>
		<hr class="mt-20" style="background-color: #E5E5E5;height: 1px;border:none">
		<view class="mt-20" style="display: flex;justify-content: space-around;">
			<button class="bg-red text-white" style="flex:0 0 30%;font-size: 30upx;" @click="submit">提交</button>

			<button class="bg-red text-white" style="flex:0 0 30%;font-size: 30upx;"
				@click="pageTo('./index')">返回</button>
		</view>
	</view>
</template>

<script>
	import myHeader from '../components/head.vue'
	import NetWorkTool from '@/api/netWorkTool'
	export default {
		data() {
			return {
				title: '发布周学习任务',
				formData: {
					name: '',
					executor: ''
				},
				// 下拉框候选
				candidates: [{
					userId: -1,
					realName: '请选择',
				}],
				idx: 0,
				rules: {
					// 对name字段进行必填验证
					name: {
						rules: [{
							required: true,
							errorMessage: '请输入学习主题',
						}]
					},
				}
			}

		},
		created() {
			this.initCandidates();
		},
		methods: {
			submit() {
				this.$refs.form.submit().then(res => {

					if (this.formData.executor == '' || this.formData.executor == -1) {
						uni.showToast({
							title: "请指派任务执行人",
							duration: 2000,
							icon: 'none',
						});
						return
					}
					let param = {
						name: this.formData.name,
						executor: this.formData.executor
					}
					NetWorkTool.POST('/api/weekly-question/publish',param).then(res=>{
						uni.showToast({
							title: "发布成功！",
							duration: 2000,
							icon: 'none',
						});
						uni.navigateTo({
							url: './index'
						})
					})
				}).catch(err => {
					uni.showToast({
						title: "请完成信息填写",
						duration: 2000,
						icon: 'none',
					});
				})
			},
			initCandidates() {
				NetWorkTool.POST('/api/weekly-question/userList', {}).then(res => {
					this.candidates = res
				})
			},
			// 选中后
			bindPickerChange(e, arr) {
				this.idx = e.target.value;
				this.formData.executor = arr[this.idx].userId;
			},
			pageTo(val) {
				uni.navigateTo({
					url: val
				})
			},

		},

		components: {
			myHeader
		},
	}
</script>

<style lang="css" scoped>
	@import url("/static/party_building/assets/style/federation.css");
</style>
